<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>滨海基金 -收益管理</title>
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/font-awesome.min.css" rel="stylesheet">
<!-- Data Tables -->
<link href="css/plugins/dataTables/dataTables.bootstrap.css"
	rel="stylesheet">
<link href="css/animate.min.css" rel="stylesheet">
<link href="css/style.min.css" rel="stylesheet">
<link href="css/plugins/sweetalert/sweetalert.css" rel="stylesheet">
<script src="js/plugins/sweetalert/sweetalert.min.js"></script>
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/plugins/jeditable/jquery.jeditable.js"></script>
<script src="js/plugins/dataTables/jquery.dataTables.js"></script>
<script src="js/plugins/dataTables/dataTables.bootstrap.js"></script>
<script type="text/javascript"
	src="http://tajs.qq.com/stats?sId=9051096" charset="UTF-8"></script>
<script src="js/My97DatePicker/WdatePicker.js"></script>
<script src="js/common.js"></script>
<style type="text/css">
/* dataTables列内容居中 */
.table>tbody>tr>td {
	text-align: center;
}

/* dataTables表头居中 */
.table>thead:first-child>tr:first-child>th {
	text-align: center;
}
</style>
</head>
<body class="gray-bg">
	<div class="row">
		<div class="col-sm-12">
			<div class="ibox float-e-margins">
				<div class="ibox-title">
					<h5>
						分数 <small>管理,列表</small>
					</h5>

					<div class="ibox-content">
					<div class="input-group" style="margin-bottom: 5px;" >
						<input id="startDate" type="text" class="form-control"
								placeholder="开始时间" style="width: 170px;" onClick="WdatePicker({lang:'zh-cn',dateFmt:'yyyy-MM-dd ',readOnly:true})" ><span style="line-height: 34px;float: left;">&nbsp;-&nbsp;</span>
						<input id="endDate" type="text" class="form-control"
								placeholder="结束时间" style="width: 170px;" onClick="WdatePicker({lang:'zh-cn',dateFmt:'yyyy-MM-dd ',readOnly:true})" > 
						</div>
					<select class="form-control" style="width: 200px; float: left;"
							id="company" onchange="getMachine(this.value,'machine')">
							<option value="">-请选择-</option>
							<c:forEach var="group" items="${groupList }">
								<option value="${group.id }">${group.groupName }</option>
							</c:forEach>
						</select>
							<select class="form-control" style="width: 200px; float: left;"
							id="machine" onchange="Search()">
							<option value="">-请选择-</option>
							
							</select>
							<div class="input-group col-md-3"
							style="margin-top: 0px; positon: relative; float: left; ">
								<button onclick="Search()" class="btn btn-info btn-search">查询</button>
							</span>
						</div>
						<table
							class="table table-striped table-bordered table-hover dataTables-example"
							id="dataTables-example">
							<thead>
								<tr style="height: 30px">
									<th style="width: 20px" align="center">序号</th>
									<th style="width: 120px" align="center">分组名称</th>
									<th style="width: 120px" align="center">单机名称</th>
									<th style="width: 100px" align="center">单价（元）</th>
									<th style="width: 100px" align="center">创建时间</th>
								</tr>
							</thead>
						</table>
					</div>
				</div>
			</div>
		</div>
		<div class="modal fade" id='addModal'>
			<div class="modal-dialog" style="width: 600px; height: 600px;">
				<div class="modal-content">
					<div class="modal-header">
						<button class="close" data-dismiss='modal'>×</button>
						<h2 class="modal-title" align="center">添加分数</h2>
					</div>
					<div class="modal-body" align="center">
						<form id="add-From" method="post">
							<div class="row form-body form-horizontal m-t">
								<div class="col-md-12 droppable sortable">
								<div class="form-group draggable">
										<label class="col-sm-3 control-label">隶属分组<span
											style="color: red;">*</span>：
										</label>
										<div class="col-sm-7">
											<select name="groupId" id="add-dept" class="form-control" onchange="getMachine(this.value,'machineId')" >
												<option value="">-请选择-</option>
												<c:forEach var="group" items="${groupList }">
													<option value="${group.id }">${group.groupName }</option>
												</c:forEach>
											</select>
										</div>
									</div>
									<div class="form-group draggable">
										<label class="col-sm-3 control-label">隶属单机<span
											style="color: red;">*</span>：
										</label>
										<div class="col-sm-7">
											<select name="machineId" id="machineId" class="form-control">
												<option value="">-请选择-</option>
											</select>
										</div>
									</div>
									<div class="form-group draggable">
										<label class="col-sm-3 control-label">分数<span
											style="color: red;">*</span>：
										</label>
										<div class="col-sm-7">
											<input type="number" name="score" id="add-branchName"
												class="form-control" placeholder="请输入分数">
										</div>
									</div>
								</div>
							</div>
						</form>
					</div>
					<div class="modal-footer" align="center">
						<div align="center" id="btd">
							<button class="btn btn-primary" id="add-btn">确认</button>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="modal fade" id='editModal'>
			<div class="modal-dialog" style="width: 600px; height: 600px;">
				<div class="modal-content">
					<div class="modal-header">
						<button class="close" data-dismiss='modal'>×</button>
						<h2 class="modal-title" align="center">编辑机组</h2>
					</div>
					<div class="modal-body" align="center">
						<form id="edit-From" method="post">
							<div class="row form-body form-horizontal m-t">
								<div class="col-md-12 droppable sortable">
								<div class="form-group draggable">
										<label class="col-sm-3 control-label">隶属分组<span
											style="color: red;">*</span>：
										</label>
										<div class="col-sm-7">
											<select name="dept.deptId" id="add-dept" class="form-control">
												<option value="">-请选择-</option>
												<c:forEach var="group" items="${groupList }">
													<option value="${group.id }">${group.groupName }</option>
												</c:forEach>
											</select>
										</div>
									</div>
									<div class="form-group draggable">
										<label class="col-sm-3 control-label">名称<span
											style="color: red;">*</span>：
										</label>
										<div class="col-sm-7">
											<input type="text" name="branchName" id="edit-branchName"
												class="form-control" placeholder="请输入名称"> <input
												type="hidden" name="branchId" id="edit-branchId">
										</div>
									</div>
								</div>
							</div>
						</form>
					</div>
					<div class="modal-footer" align="center">
						<div align="center" id="btd">
							<button class="btn btn-primary" id="edit-btn">确认</button>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<script type="text/javascript">
		var table;
		$(function() {
			//提示信息
			var lang = {
				"sProcessing" : "<div style=\"float:right;width:50%\" >处理中...</div>",
				"sLengthMenu" : "每页 _MENU_ 项",
				"sZeroRecords" : "没有匹配结果",
				"sInfo" : "当前显示第 _START_ 至 _END_ 项，共 _TOTAL_ 项。",
				"sInfoEmpty" : "当前显示第 0 至 0 项，共 0 项",
				"sInfoFiltered" : "(由 _MAX_ 项结果过滤)",
				"sInfoPostFix" : "",
				"sSearch" : "搜索:",
				"sUrl" : "",
				"sEmptyTable" : "表中数据为空",
				"sLoadingRecords" : "载入中...",
				"sInfoThousands" : ",",
				"oPaginate" : {
					"sFirst" : "首页",
					"sPrevious" : "上页",
					"sNext" : "下页",
					"sLast" : "末页",
					"sJump" : "跳转"
				},
				"oAria" : {
					"sSortAscending" : ": 以升序排列此列",
					"sSortDescending" : ": 以降序排列此列"
				}
			};
			
			//初始化表格
			table = $("#dataTables-example")
					.dataTable(
							{

								"fnDrawCallback" : function() {
									var api = this.api();
									var startIndex = api.context[0]._iDisplayStart;//获取到本页开始的条数
									api.column(0).nodes().each(
											function(cell, i) {
												cell.innerHTML = startIndex + i
														+ 1;
											});
								},
								language : lang, //提示信息
								autoWidth : false, //禁用自动调整列宽
								stripeClasses : [ "odd", "even" ], //为奇偶行加上样式，兼容不支持CSS伪类的场合
								processing : true, //隐藏加载提示,自行处理
								"paging": false,//开启表格分页
								serverSide : true, //启用服务器端分页
								searching : false, //禁用原生搜索
								orderMulti : false, //启用多列排序
								order : [], //取消默认排序查询,否则复选框一列会出现小箭头
								renderer : "bootstrap", //渲染样式：Bootstrap和jquery-ui
								pagingType : "simple_numbers", //分页样式：simple,simple_numbers,full,full_numbers
								"aLengthMenu" : [ 10 ],
								"bLengthChange" : false,//屏蔽tables的一页展示多少条记录的下拉列表
								ordering : false, //关闭排序图标
								ajax : function(data, callback, settings) {
									//封装请求参数
									var param = {};
									param.limit = data.length;//页面显示记录条数，在页面显示每页显示多少项的时候
									param.start = data.start;//开始的记录序号
									param.page = (data.start / data.length) + 1;//当前页码
									//param.darw=darw;  //计数器
									var activityTitle = $("#title").val();
									if (activityTitle != null
											&& activityTitle != "") {
										param.machineName = activityTitle
									}
									var company = $("#machine").val()
									.trim();
								if (company != null
										&& company != "") {
									param.machineId = company
								}
								param.startDate=$("#startDate").val();
								param.endDate=$("#endDate").val();
									//console.log(param);
									//ajax请求数据
									$
											.ajax({
												type : "POST",
												url : "queryRevenue.do",
												cache : false, //禁用缓存
												data : param, //传入组装的参数
												dataType : "json",
												success : function(result) {

													//console.log(result);
													//setTimeout仅为测试延迟效果
													setTimeout(
															function() {
																//封装返回数据
																var returnData = {};
																draw = result.draw;//后台返回的计数器
																returnData.draw = data.draw;//这里直接自行返回了draw计数器,应该由后台返回
																returnData.recordsTotal = result.total;//返回数据全部记录
																returnData.recordsFiltered = result.total;//后台不实现过滤功能，每次查询均视作全部结果
																returnData.data = result.data;//返回的数据列表

																//console.log(returnData);
																//调用DataTables提供的callback方法，代表数据已封装完成并传回DataTables进行渲染
																//此时的数据需确保正确无误，异常判断应在执行此回调前自行处理完毕
																callback(returnData);
															}, 200);
												}
											});
								},
								//列表表头字段
								columns : [
										{
											"data" : null
										},
										{ 
											"data" : "groupName"
										},
										{ 
											"data" : "machineName"
										},{
											"data" : "money"
										},
										{
											"data" : function(data) {

												if (data.createDate == null) {
													return "";
												}
												return FormatDate(new Date(
														data.createDate));
											}
										} ]
							})//.api();	
							$("#add")
							.click(function() {
											$("#addModal").modal("show");
									})
			//添加通知操作
			$("#add-btn").click(function() {
				var remake = $("#machineId").val();
				var deptName = $("#add-branchName").val();
				if (deptName == "") {
					swal("温馨提示!", "请输入名称!", "error");
					return false;
				}
				if (remake == "") {
					swal("温馨提示!", "请选择单机!", "error");
					return false;
				}
				$.ajax({
					url : "addScore.do",
					data : $("#add-From").serializeArray(),
					type : "post",
					dataType : "json",
					success : function(result) {
						if (result.code == 1) {
							swal({
								title : "提示",
								text : "操作成功！",
								type : "success",
								confirmButtonText : "确定"
							}, function() {
								$("#addModal").modal("hide");
								Search();
							});

						} else {
							sweetAlert("提示", "未知异常!", "error");
						}

					},
					error : function() {
						sweetAlert("异常", "网络出现异常!", "error");
					}

				});// ajax end;
			}); //添加通知 end
		})
		function Search() {
			/* var oSettings = table.fnSettings();  
			oSettings._iDisplayStart = 0;  
			table.fnDraw(oSettings);   */
			table.fnDraw();
		}
		function Search2() {
			/* var oSettings = table.fnSettings();  
			oSettings._iDisplayStart = 0;  
			table.fnDraw(oSettings);   */
			table2.fnDraw();
		}
		function getMachine(groupId,machine){
			$
			.ajax({
				url : "getAllMachine.do",
				type : "post",
				data : {
					groupId : groupId
				},
				dataType : "json",
				success : function(result) {
					if (result.code == 1) {
						var deptHtml = "<option value=\"\">-请选择-</option>";
						for (var i = 0; i < result.list.length; i++) {
							deptHtml += "<option value=\""+result.list[i].id+"\">"
									+ result.list[i].machineName
									+ "</option>";
						}
						$("#"+machine).empty();
						$("#"+machine).append(
								deptHtml);
					} else {
						sweetAlert("提示", "未知异常!",
								"error");
					}

				},
				error : function() {
					sweetAlert("异常", "网络出现异常!",
							"error");
				}

			});// ajax end;
		}
		function delActivity(id) {
			swal({
				title : "您确定要删除这条信息吗",
				text : "删除后将无法恢复，请谨慎操作！",
				type : "warning",
				showCancelButton : true,
				confirmButtonColor : "#DD6B55",
				confirmButtonText : "删除",
				cancelButtonText : "取消",
				closeOnConfirm : false,
			}, function() {
				$.ajax({
					url : "delMachine.do",
					data : {
						id : id
					},
					type : "post",
					dataType : "json",
					success : function(result) {
						if (result.code == 1) {

							swal({
								title : "提示",
								text : "删除成功！",
								type : "success",
								confirmButtonColor : "#DD6B55",
								confirmButtonText : "确定",
								closeOnConfirm : true
							}, function() {
								Search();
							});
						} else {
							sweetAlert("提示", "删除失败!", "error");
						}
					},
					error : function() {
						sweetAlert("异常", "网络出现异常!", "error");
					}

				})

			});
		}

		function editActivity(id) {
			$
					.ajax({
						url : "machineDetail.do",
						data : {
							id : id
						},
						type : "post",
						dataType : "json",
						success : function(result) {
							if (result.code == 1) {
								$("#editModal").modal("show");
								$("#edit-branchId").val(result.machine.id);
								$("#edit-branchName").val(
										result.machine.machineame);
								$("#edit-dept").val(result.machine.groupId);
							} else {
								sweetAlert("提示", "获取失败!", "error");
							}

						},
						error : function() {
							sweetAlert("异常", "网络出现异常!", "error");
						}

					});// ajax end;
		}
		//编辑通知操作
		$("#edit-btn").click(function() {
			var remake = $("#edit-dept").val();
			var deptName = $("#edit-branchName").val();
			if (deptName == "") {
				swal("温馨提示!", "请输入名称!", "error");
				return false;
			}
			if (remake == "") {
				swal("温馨提示!", "请选择分组!", "error");
				return false;
			}
			$.ajax({
				url : "editMachine.do",
				data : $("#edit-From").serializeArray(),
				type : "post",
				dataType : "json",
				success : function(result) {
					if (result.code == 1) {
						swal({
							title : "提示",
							text : "操作成功！",
							type : "success",
							confirmButtonText : "确定"
						}, function() {
							$("#editModal").modal("hide");
							Search();
						});

					} else {
						sweetAlert("提示", "未知异常!", "error");
					}

				},
				error : function() {
					sweetAlert("异常", "网络出现异常!", "error");
				}

			});// ajax end;
		}); //编辑通知 end
		function toDate(data) {
			var date = new Date(data);
			var y = date.getFullYear();
			var m = date.getMonth() + 1;
			m = m < 10 ? '0' + m : m;
			var d = date.getDate();
			d = d < 10 ? ('0' + d) : d;
			return y + '-' + m + '-' + d;
		}
	</script>
</body>

</html>